<template>
  <div>
    <input :type="type" :value="value" @input="inputHandler" />
  </div>
</template>

<script>
export default {
  name: 'KInput',
  props: {
    type: {
      type: String,
      default: 'text'
    },
    value: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      inputValue: this.value
    }
  },
  methods: {
    inputHandler(e) {
      this.inputValue = e.target.value
      // 通知父组件值更新
      this.$emit('input', this.inputValue)
      // 通知FormItem做校验
      this.$parent.$emit('validate', this.inputValue)
    }
  }
}
</script>
<style lang="" scoped>
</style>